import React from 'react';
import { withRouter } from 'react-router-dom';
import { useHistory } from 'react-router-dom';
import {Button, Input, Form,Dialog } from 'react-vant'
import { compareUser } from '../../../api/userinfo';
const Loginpass = (props) => {
    const [form] = Form.useForm()
    const history = useHistory()
    const onFinish =  async (values) => {
      let res = await compareUser(values)
      if(res.code){
        Dialog.alert({
          message:res.msg
        })
      }else{
        history.push({pathname:'/Layout/Home',state:{user:res}})
      }
    }
    const goFindpass = ()=>{
      history.push('/Findpass')
    }
    const goRegister = ()=>{
      history.push('/Register')
    }
    return (
        <Form
        style={{margin:'200rem 0'}}
          form={form}
          onFinish={onFinish}
          footer={
            <div style={{ margin: '40rem 16rem 0' }}>
              <Button round nativeType='submit' type='primary' block style={{backgroundColor:'#ff0000',border:'none',fontWeight:'bold'}}>
                提交
              </Button>
            </div>
          }
        >
          <Form.Item
            tooltip={{
              message:
                '这是一段很牛的提示',
            }}
            rules={[{ required: true, message: '请填写用户名' }]}
            name='username'
            label='用户名'
            initialValue='admin'
          >
            <Input placeholder='请输入用户名' />
          </Form.Item>
          <Form.Item
            rules={[{ required: true, message: '请填写密码' }]}
            name='password'
            label='密码'
            initialValue='root'
          >
            <Input placeholder='请输入密码' />
            
          </Form.Item>
          <div  style={{width:'100%',display:'flex',justifyContent:'space-between'}}>
            <span style={{color:'#0074e0',fontSize:'10rem',margin:'13rem',display:'block'}} onClick={()=>{goFindpass()}}>忘记密码？</span>
            <span style={{color:'#0074e0',fontSize:'10rem',margin:'13rem',display:'block'}} onClick={()=>{goRegister()}}>注册账户</span>
          </div>
        </Form>
      )
}

export default withRouter(Loginpass);
